<template>
	<div id="goods_store">
		<el-form :inline="true" size="medium">
			<el-form-item>
				<el-input placeholder="仓库名称" v-model="params.name" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="search">搜索</el-button>
				<!-- <el-button  @click="dialogVisible = true">创建仓库</el-button> -->
			</el-form-item>
		</el-form>

		<el-table :data="list" v-loading="loading" stripe>
			<el-table-column label="id" prop="id" align="center"></el-table-column>
			<el-table-column label="仓库名称" prop="name" align="center"></el-table-column>
			<el-table-column label="仓库地址" prop="address" align="center"></el-table-column>
			<el-table-column label="备注" prop="remark" align="center"></el-table-column>
			<el-table-column label="暂停状态" align="center">
				<template slot-scope="scope">
					<span v-if="scope.row.stop_status === 1">未暂停</span>
					<span v-if="scope.row.stop_status === 2">已暂停</span>
				</template>
			</el-table-column>
			<el-table-column label="暂停理由" prop="stop_reason" align="center" show-overflow-tooltip></el-table-column>
			<el-table-column label="状态" align="center">
				<template slot-scope="scope">
					<span v-if="scope.row.status === 1">已开启</span>
					<span v-if="scope.row.status === 2">已关闭</span>
				</template>
			</el-table-column>
			<el-table-column label="创建时间" prop="createTime" align="center">
				<template slot-scope="scope">
					{{$moment(scope.row.createTime).format('Y-MM-DD HH:mm')}}
				</template>
			</el-table-column>
			<!-- <el-table-column label="操作" align="center">
				<template slot-scope="scope">
					<el-button type="text" @click="setData(scope.row)">修改</el-button>
					<el-button type="text" class="error" @click="del(scope.row.id)">删除</el-button>
				</template>
			</el-table-column> -->
		</el-table>

		<el-pagination 
			class="page"
			background
			@size-change="handleSizeChange" 
			@current-change="getList" 
			:current-page.sync="params.pageNo" 
			:page-sizes="[10, 20, 50, 100]" 
			:page-size="params.pageSize" 
			layout="total, sizes, prev, pager, next, jumper" 
			:total="total">
		</el-pagination>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				params: {
					pageNo: 1,
					pageSize: 10,
					isCount: true,
					name: '',
				},
				list: [],
				total: 0,
				loading: false,
				formLoading: false,
				dialogVisible: false,
				formData: {
					name: '',
					address: '',
					remark: ''
				},
				rules: {
					name: {
						message: '请输入仓库名称',
						trigger: 'blur',
						required: true
					}
				}
			};
		},

		watch: {},

		create() {},

		mounted() {
			this.search();
		},

		methods: {
			handleClose(done){
				this.reset()
				done();
			},
			
			handleSizeChange(value) {
				this.params.pageSize = value 
				this.search()
			},
			
			search(){
				this.params.pageNo = 1
				this.params.isCount = true 
				this.getList();
			},
			
			getList() {
				this.loading = true
				this.$request.post({
					url: '/ReportApi/tenant/storelist',
					params: this.params,
					success: result =>{
						this.list = result[0] 
						if(this.params.isCount){
							this.params.isCount = false 
							this.total = result[1]
						}
					},
					finally: ()=>{
						this.loading = false 
					}
				})
			},
		},

		beforeDestroy() {}
	}
</script>

<style>

</style>

<style lang="scss" scoped>
	.page{
		text-align: right;
		margin-top: 20px;
	}
</style>
